<template>
  <div class="page_body">
    <HomeTop :topTitle="topTitle"></HomeTop>
    <div class="referee_order_view_body">
      <!-- 考试信息 -->
      <div class="referee_order_view_card">
        <div class="referee_order_view_top_item">
          <img
            class="referee_order_view_top_img"
            src="../../assets/image/order_top_img01.png"
            alt="封面"
          />
          <div>
            <div class="referee_order_view_top_title" v-if="orderType == 1">
              上海市篮球协会会员注册
            </div>
            <div class="referee_order_view_top_title" v-if="orderType == 2">
              上海市篮球协会裁判员注册
            </div>
          </div>
        </div>
      </div>
      <!-- 考生信息 -->
      <div class="referee_order_view_card content_card">
        <div class="referee_order_view_tab_box">
          <div class="referee_order_view_tab">报名信息</div>
        </div>
        <div class="referee_order_view_tab_content_user">
          <div class="referee_order_view_tab_content_left">
            <div class="referee_order_view_tab_content_item">
              <div class="referee_order_view_tab_content_item_title">
                姓名：
              </div>
              <div class="referee_order_view_tab_content_item_value user_value">
                {{ orderData.name }}
              </div>
            </div>

            <div class="referee_order_view_tab_content_item">
              <div class="referee_order_view_tab_content_item_title">
                性别：
              </div>
              <div class="referee_order_view_tab_content_item_value user_value">
                {{ orderData.sex }}
              </div>
            </div>

            <div class="referee_order_view_tab_content_item">
              <div class="referee_order_view_tab_content_item_title">
                证件号：
              </div>
              <div class="referee_order_view_tab_content_item_value user_value">
                {{ orderData.identity_number }}
              </div>
            </div>
            <div class="referee_order_view_tab_content_item">
              <div class="referee_order_view_tab_content_item_title">
                注册所在地：
              </div>
              <div class="referee_order_view_tab_content_item_value user_value">
                {{ orderData.register_region }}
              </div>
            </div>
            <div class="referee_order_view_tab_content_item">
              <div class="referee_order_view_tab_content_item_title">
                裁判员等级：
              </div>
              <div class="referee_order_view_tab_content_item_value user_value">
                {{ refereeLevelFilterFn(orderData.referee_level) }}
              </div>
            </div>
          </div>
          <img
            class="referee_order_view_tab_content_user_img"
            :src="orderData.photo"
          />
        </div>
      </div>
      <!-- 订单信息 -->
      <div
        class="referee_order_view_card content_card"
        style="margin-bottom: 0"
      >
        <div
          class="referee_order_view_tab_content_item"
          style="margin-top: 0.24rem"
        >
          <div class="referee_order_view_tab_content_item_title">
            注册时间：
          </div>
          <div class="referee_order_view_tab_content_item_value">
            {{ orderData.created_at }}
          </div>
        </div>
        <img
          v-if="orderData.audit_status == 1"
          class="audit_status_img"
          src="../../assets/image/audit_status_img01.png"
        />
        <img
          v-if="orderData.audit_status == 2"
          class="audit_status_img"
          src="../../assets/image/audit_status_img02.png"
        />
        <img
          v-if="orderData.audit_status == 3"
          class="audit_status_img"
          src="../../assets/image/audit_status_img03.png"
        />
      </div>

      <div
        class="referee_order_view_btn"
        @click="toRegisterFn()"
        v-if="orderData.audit_status == 3"
      >
        重新注册
      </div>
    </div>
  </div>
</template>
<style src="../../assets/css/order/refereeRegisterOrderView.css" scoped></style>

<script>
import HomeTop from "@/components/homeTop.vue";
import { Indicator, Toast } from "mint-ui";

export default {
  name: "RefereeRegisterOrderView",
  components: {
    HomeTop,
  },
  data() {
    return {
      topTitle: "注册详情", // 顶部组件参数设置
      record_id: "", // 记录Id
      orderType: "", // 订单类型
      orderData: {
        name: "",
        photo: "",
        sex: "",
        identity_number: "",
        register_region: "",
        referee_level: "",
        audit_status: "",
        audit_time: "",
        created_at: "",
      }, // 订单详细数据
      orderInterval: null,
      baseAPIUrl: this.$store.state.baseAPIUrl,
      identityNumberShow: "",
      refereeLevelList: [
        {
          value: 1,
          label: "三级",
        },
        {
          value: 2,
          label: "二级",
        },
        {
          value: 3,
          label: "一级",
        },
        {
          value: 4,
          label: "国家级",
        },
        {
          value: 5,
          label: "国际级",
        },
      ], // 裁判等级值字典
    };
  },
  created: function () {
    let query = this.$route.query;
    if (query.recordId != undefined && query.recordId != "") {
      this.record_id = query.recordId;
    }
    if (query.type != undefined && query.type != "") {
      this.orderType = query.type;
    }

    this.getDetailDataFn();
  },
  methods: {
    // 查询订单详情数据
    getDetailDataFn: function () {
      let that = this;
      let url = "/mobile/refereeOrderDetail";
      let data = {
        record_id: this.record_id,
      };
      this.axios
        .post(url, data)
        .then((response) => {
          if (response.code == 0) {
            that.orderData = response.info;
            let nub = response.info.identity_number;
            let be = nub.substring(0, 3);
            let af = nub.substring(nub.length - 4, nub.length);
            that.identityNumberShow = be + "***********" + af;
          } else {
            Toast({
              message: response.msg,
              duration: 3000,
            });
          }
        })
        .catch(function (error) {
          Indicator.close();
          console.log(error);
        });
    },

    // 等级过滤
    refereeLevelFilterFn: function (val) {
      let tx = "无";
      this.refereeLevelList.forEach((item) => {
        if (item.value == Number(val)) {
          tx = item.label;
        }
      });
      return tx;
    },

    // 重新注册
    toRegisterFn: function () {
      this.$router.push({
        name: "RefereeRegister",
      });
    },
  },
};
</script>
